<template>
  <div>
    <el-dialog
      :close-on-click-modal="false"
      :visible.sync="dialogVisible"
      title="利息记录"
      width="900px">
      <div style="overflow: hidden;">
        <div>
          <el-table
            v-loading="listLoading2"
            max-height="400"
            :data="tableData2"
            border
            style="width: 100%; margin-top: 20px">
            <el-table-column fixed="left" label="合同号" min-width="140" align="center" prop="orderSn">
            </el-table-column>
            <el-table-column fixed="left" label="客户名称" min-width="200" align="center" prop="customerName">
            </el-table-column>
            <el-table-column label="商品牌号" min-width="200" align="center" prop="goodsSn">
            </el-table-column>
            <el-table-column label="业务员" min-width="100" align="center" prop="userName">
            </el-table-column>
            <el-table-column label="采购员" min-width="100" align="center" prop="purchaseUserName">
            </el-table-column>
            <el-table-column label="排货单号" min-width="160" align="center" prop="billSn">
            </el-table-column>
            <el-table-column label="合同金额" min-width="130" align="center" prop="orderAmount">
            </el-table-column>
            <el-table-column label="采购计息金额" min-width="130" align="center" prop="pComputeAmount">
            </el-table-column>
            <el-table-column label="采购延迟金" min-width="130" align="center" prop="pInterestAmount">
            </el-table-column>
            <el-table-column label="物流计息金额" min-width="130" align="center" prop="dComputeAmount">
            </el-table-column>
            <el-table-column label="物流延迟金" min-width="130" align="center" prop="dInterestAmount">
            </el-table-column>
            <el-table-column label="不执行计息金额" min-width="130" align="center" prop="unComputeAmount">
            </el-table-column>
            <el-table-column label="利率" min-width="130" align="center" prop="interestRate">
            </el-table-column>
            <el-table-column label="计息时间" min-width="130" align="center" prop="computeDate">
            </el-table-column>
          </el-table>
        </div>
        <div class="pagination-container">
          <el-pagination
            background
            @size-change="handleSizeChange2"
            @current-change="handleCurrentChange2"
            layout="total, sizes,prev, pager, next,jumper"
            :current-page.sync="listQuery2.pageNum"
            :page-size="listQuery2.pageSize"
            :page-sizes="[10,20,30,50]"
            :total="count2">
          </el-pagination>
        </div>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import {
  getFundCostListAPI,
} from '@/api/accounting';
const defaultListQuery2 = {
  foId:'',//发货延迟基金ID
  orderSn: "", //合同编码
  billSn: "", //排货单号
  customerId: "", //客户ID
  userId: "", //业务员ID
  purchaseUserId: "", //采购员ID
  computeTime: [], //计息时间
  isExport: 0, //是否导出,0-否，1-是
  pageNum: 1, //第几页
  pageSize: 10 //每页几条
};
export default {
  name: "fundCostList",
  data(){
    return {
      dialogVisible: false,
      listLoading2: false,
      tableData2: [],
      listQuery2: JSON.parse(JSON.stringify(defaultListQuery2)),
      count2:0
    }
  },
  filters:{

  },
  created() {
  },
  methods:{
    showPop(item) {
      this.dialogVisible = true;
      this.listQuery2 = JSON.parse(JSON.stringify(defaultListQuery2));
      this.listQuery2.foId = item.foId;
      this.getList2();
    },
    handleClose2(){
      this.dialogVisible = false;
    },
    getList2() {
      this.listLoading2 = true;
      let data = JSON.parse(JSON.stringify(this.listQuery2));
      getFundCostListAPI(data).then(response => {
        this.tableData2 = response.list;
        this.count2 = response.count;
        this.listLoading2 = false;
      }).catch(()=>{
        this.listLoading2 = false;
      });
    },
    handleSizeChange2(val){
      this.listQuery2.pageNum = 1;
      this.listQuery2.pageSize = val;
      this.getList2();
    },
    handleCurrentChange2(val){
      this.listQuery2.pageNum = val;
      this.getList2();
    },
  }
};
</script>

<style scoped lang="scss">

</style>
